<template>
  <div class="content">
    <div class="header">
        <div class="head">
            <div class="title">
                <img class="cart_img" :src="imgUrl" alt="">
                <span class="title_name">{{Title}}</span>
            </div>
            <div class="title_info" v-if="info">{{ info }}</div>
        </div>
    </div>
  </div>
</template>

<script>
export default {
    props:{
        Title:String,
        imgUrl:String,
        info:String
    },
    created(){
    }
}
</script>

<style scoped>
.header {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 80px;
    border-bottom: 2px solid #d84814;
    background-color: #ffffff;
    padding-top: 10px;
}
.head{
    width: 80%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.title{
    display: flex;
}
.cart_img{
    width: 26px;
    margin-right: 16px;
}
.title_name{
    font-size: 28px;
    margin-right: 16px;

}
.title_info{
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 40px;
    font-size: 12px;
    color: #9e9b9b;
}
</style>